<template>
  <page>
    <template v-slot:header>
      <h2>
        <i class="icon iconfont">&#xe612;</i>
        <span>{{ $t("patch.cve_list") }}</span>
      </h2>
    </template>
    <template v-slot:content>
      <el-dialog
        :title="title"
        :visible.sync="display"
        :before-close="handleClose"
      >
        <issue-form
          @click="handleClose"
          :templateIds="templateIds"
          v-if="type == 'issue'"
        ></issue-form>
        <import-cve
          v-else-if="type === 'import'"
          :dialogType="'CVE'"
          @click="handleClose"
          :origin="origin"
        >
        </import-cve>
        <delete
          v-else-if="type === 'delete'"
          :content="delete_content"
          :handleCancel="handleClose"
          :handleOk="handleDeleteOk"
        >
        </delete>
      </el-dialog>
      <p>{{ $t("patch.cve_list_table_description") }}</p>
      <ky-table
        :getData="getAllCVE"
        :search_data="search_data"
        :search_criteria="search_criteria"
        ref="table"
        :showSelect="true"
      >
        <template v-slot:table-action>
          <authorization-button
            class="kylin-item-button"
            @click="handleIssue"
            name="config:create"
            :disabled="$refs.table && $refs.table.selectRow.ids.length == 0"
          >
            {{ $t("issue") }}
          </authorization-button>
          <authorization-button
            class="kylin-item-button"
            @click="handleDelete"
            name="config:create"
            :disabled="$refs.table && $refs.table.selectRow.ids.length != 1"
          >
            {{ $t("delete") }}
          </authorization-button>

          <authorization-button
            class="kylin-item-button"
            @click="handleImport"
            name="config:create"
          >
            {{ $t("import") }}
          </authorization-button>
          <authorization-button
            class="kylin-item-button"
            @click="handleExport"
            name="config:create"
          >
            {{ $t("export") }}
          </authorization-button>
        </template>
        <template v-slot:table>
          <el-table-column type="expand">
            <template slot-scope="scope">
              <el-form label-position="left" inline>
                <el-form-item :label="$t('description')">
                  <span>{{ scope.row.description }}</span>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
          <el-table-column prop="cveId" :label="$t('patch.CVE_number')">
          </el-table-column>
          <el-table-column prop="severity" :label="$t('patch.risk_level')">
          </el-table-column>
          <el-table-column :label="$t('system.status')">
            已修复
          </el-table-column>
          <el-table-column prop="issued_date" :label="$t('patch.CVE_time')">
          </el-table-column>
        </template>
      </ky-table>
    </template>
  </page>
</template>

<script>
import issueForm from "./form/issueForm.vue";
import { download } from "@/utils";

import Page from "@/components/Page";
import kyTable from "@/components/KyTable";
import AuthorizationDropdownItem from "@/components/AuthorizationDropdownItem";
import { getAllCVE, exportCVE, deleteConfirm, deleteCVE } from "@/api/patch";
import CreateOrUpdate from "../normalLibrary/form/create_or_update.vue";
import ImportCve from "@/views/product/form/importRepo.vue";
import Delete from "@/components/Delete";
import AuthorizationButton from "@/components/AuthorizationButton";
export default {
  name: "cvelist",
  components: {
    Page,
    kyTable,
    CreateOrUpdate,
    issueForm,
    Delete,
    AuthorizationButton,
    AuthorizationDropdownItem,
    ImportCve,
  },
  activated() {
      this.$refs.table.handleSearch();
  },
  methods: {
    getAllCVE,
    handleIssue() {
      this.title = this.$t("configure.issue");
      this.display = true;
      this.type = "issue";
      this.templateIds = this.$refs.table.selectRow.ids;
    },
    handleImport() {
      this.display = true;
      this.type = "import";
    },
    handleExport() {
      exportCVE(this.$refs.table.selectRow.ids).then((res) => {
        download(res, "CVE_list");
      });
    },
    async handleDelete() {
      this.display = true;
      this.type = "delete";
      this.title = this.$t("patch.delete_cve");
      const res = await deleteConfirm(...this.$refs.table.selectRow.ids);
      this.delete_content = this.$t("patch.delete_cve_content").replace(
        "%s",
        res.data.data
      );
    },
    handleClose(type) {
      this.disableName = false;
      this.display = false;
      this.edit_id = null;
      this.type = "";
      if (type === "success") {
        this.$refs.table.handleSearch();
      }
    },
    handleDeleteOk() {
      deleteCVE(...this.$refs.table.selectRow.ids).then((res) => {
        if (res.data.code == 0) {
          this.$message({
            type: "success",
            message: "删除成功",
          });
          this.display = false;
          this.edit_id = null;
          this.type = "";
          this.$refs.table.handleSearch();
        } else {
          this.$message({
            type: "error",
            message: res.data.message,
          });
        }
      });
    },
  },
  data() {
    return {
      disableName: false,
      type: "",
      edit_id: "",
      d_normal: true,
      title: "",
      osName: "",
      osVersion: "",
      osArch: "",
      display: false,
      delete_content: "",
      origin: "cvelist",
      search_criteria: {
        sortBy: "id",
        sortOrder: "desc",
      },
      ids: [],
      search_data: {
        cveId: {
          name: "patch.CVE_number",
          type: "text",
        },
        issued_date: {
          name: "patch.cve_range",
          type: "date",
        },
        severity: {
          name: "patch.risk_level",
          type: "select",
          items: [
            { key: "Low", name: "低风险" },
            { key: "Moderate", name: "中风险" },
            { key: "Important", name: "高风险" },
            { key: "Critical", name: "严重风险" },
          ],
        },
      },
    };
  },
};
</script>

<style>
</style>